import { Col, Row, Switch } from 'antd';
import React from 'react';
import styles from '../styles.less';

function Required({ value, onChange }) {
  const { required } = value;

  return (
    <Row style={{ width: '100%' }}>
      <Col span={12} style={{ display: 'flex', alignItems: 'center' }}>
        <div className={styles.label}>必填</div>
        <div className={styles.item}>
          <Switch
            checked={required === undefined ? true : required}
            checkedChildren="是"
            unCheckedChildren="否"
            onChange={required => onChange({ required })}
          />
        </div>
      </Col>
    </Row>
  );
}

export default Required;
